<template>
	<view>
		<view class="flex mb-40" :class="[isIndex?'':'border-b-EEEEEE']" v-if="item.length!=0"
			@click.self="doctintro(item.id)" style="padding-left: 28rpx;padding-right: 32rpx;box-sizing: border-box;">
			<view class="mr-24" style="width: 120rpx;height: 120rpx;border-radius: 50%;">
				<image :src="baseUrl+item.image" mode=""
					style="	z-index: -1;width: 120rpx;height: 120rpx;border-radius: 50%;z-index: 3;"></image>
			</view>
			<view class=" f-400 c-77 f-26">
				<view class="flex align-center mb-6 f-400 c-77 f-26">
					<view class="mr-24 f-bold c-11 f-32" style="">
						{{item.doctor_name}}
					</view>
					<view class="mr-24" style="" v-if="!isIndex">
						{{item.type_name}}
					</view>
					<view class=" text-overflow" style="max-width: 50%;text-align: left;">
						{{item.doctor_position}}
					</view>
				</view>
				<view class="" style="text-align: left" v-if="!isIndex">
					{{item.address}}{{item.hospital_name}}
				</view>
				<!-- <view class="" style="width: 546rpx;"> -->
				<view class="" style="width: 98%;">
					<!-- <view class="" style="     margin-top: 0rpx;position: absolute;">
						擅长：
					</view> -->
					<view style="text-indent: 0rpx;text-align: left;" v-html="item.goodat"
						:class="[isIndex===true?'line2':'']">

					</view>
				</view>
				<view class="mt-10  mb-21 flex-row-wrap" v-if="null!=item.doctor_tags">
					<view  v-for="(item1,index1) in item.doctor_tags.split(',')"
						:key="index1" class=" aj-center bor-r6 mt-10 c-DFB982 mr-20 border-DFB982 f-24 fw-400"
						style=" padding-left: 10rpx;padding-right: 10rpx ;padding-top: 6rpx;padding-bottom: 6rpx;">
						{{item1}}
					</view>
				</view>
			</view>
		</view>

		<view class="flex mb-40 border-b-EEEEEE" v-if="item.length==0"
			style="padding-left: 28rpx;padding-right: 32rpx;box-sizing: border-box;">
			<view class="mr-24" style="width: 120rpx;height: 120rpx;">
				<image :src="img" mode=""></image>
			</view>
			<view class=" f-400 c-77 f-26">
				<view class="flex align-center mb-6 f-400 c-77 f-26">
					<view class="mr-24 f-bold c-11 f-32">
						{{name}}
					</view>
					<view class="mr-24 ">
						{{Departments}}
					</view>
					<view class=" ">
						{{grade}}
					</view>
				</view>
				<view class="">
					{{site}}
				</view>
				<view class="">
					{{goodAt}}
				</view>
				<view class="mt-10 flex mb-21">
					<view class="aj-center bor-r6 c-DFB982   border-DFB982 f-24 fw-400"
						style="width: 116rpx;height: 44rpx;">
						{{btn1}}
					</view>
				</view>
			</view>
		</view>
	</view>
	</view>
</template>

<script>
	export default {
		props: {
			item: {
				type: Object,
				default: {}
			},
			img: {
				type: String,
				default: '../../static/doct.png'
			},
			name: {
				type: String,
				default: '张兴'
			},
			// 科室
			Departments: {
				type: String,
				default: '儿科'
			},
			// 等级
			grade: {
				type: String,
				default: '副主任医师'
			},
			// 职责
			position: {
				type: String,
				default: ''
			},
			// 地址
			site: {
				type: String,
				default: 'XXX省XXX医院'
			},
			// 擅长
			goodAt: {
				type: String,
				default: '	擅长：糖尿病、感染性疾病、危重症治疗、感染 休克、休克治疗。'
			},
			btn1: {
				type: String,
				default: '知名医院'
			},
			btn2: {
				type: String,
				default: '知名医院'
			},
			btn3: {
				type: String,
				default: '知名医院'
			},
			//判断是否是首页，首页样式不同
			isIndex: {
				type: Boolean,
				default: false
			}
		},
		data() {
			return {
				buttonList: [],
				baseUrl: this.$baseUrl, //后台域名地址
			}
		},
		mounted() {
			// 	let items = this.item.doctor_tags;
			// 	let arritem = items.split(',');
			// 	this.buttonList = arritem;

			// 	this.$forceUpdate()
		},
		methods: {
			doctintro(id) {
				// this.$emit('doctintro',id)
			}
		}
	}
</script>

<style scoped>
	@import url("@/common/css/fress.css");
	@import url("@/common/css/mycss.css");

	image {
		width: 100%;
		height: 100%;
	}

	.line2 {
		word-break: break-all;
		text-overflow: ellipsis;
		overflow: hidden;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
	}
</style>
